<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=9; IE=8; IE=7; IE=EDGE">
    <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7"/>
    <title>乐优商城--我的订单</title>
    <link rel="icon" href="assets/img/favicon.ico">

    <link rel="stylesheet" type="text/css" href="css/webbase.css"/>
    <link rel="stylesheet" type="text/css" href="css/pages-seckillOrder.css"/>

    <link rel="stylesheet" href="js/elementUI/index.css">
</head>

<body>

<!-- 头部栏位 -->
<!--页面顶部，由js动态加载-->
<script type="text/javascript" src="plugins/jquery/jquery.min.js"></script>

<script type="text/javascript" src="js/plugins/jquery.easing/jquery.easing.min.js"></script>
<script type="text/javascript" src="js/plugins/sui/sui.min.js"></script>
<script type="text/javascript" src="js/plugins/jquery-placeholder/jquery.placeholder.min.js"></script>
<script type="text/javascript" src="js/widget/nav.js"></script>
<script src="https://cdn.bootcdn.net/ajax/libs/moment.js/2.27.0/moment.min.js"></script>
</body>
<!--header-->
<div id="account">
    <div id="nav-bottom"></div>
    <ly-top></ly-top>
    <div class="py-container">
        <div class="yui3-g home">
            <!--左侧列表-->
            <div class="yui3-u-1-6 list">

                <div class="person-info">
                    <div class="person-photo"><img src="img/_/photo.png" alt=""></div>
                    <div class="person-account">
                        <span class="name">{{user.username}}</span>
                        <span class="safe"><a href="#" @click="logout">退出登录 </a></span>
                    </div>
                    <div class="clearfix"></div>
                </div>
                <div class="list-items">
                    <dl>
                        <dt><i>·</i> 订单中心</dt>
                        <dd><a href="javascript:void(0)" @click="query.status=0" :class="{'list-active':query.status===0}">我的订单</a></dd>
                        <dd><a href="javascript:void(0)" @click="query.status=1" :class="{'list-active':query.status===1}">待付款</a></dd>
                        <dd><a href="javascript:void(0)" @click="query.status=2" :class="{'list-active':query.status===2}">待发货</a></dd>
                        <dd><a href="javascript:void(0)" @click="query.status=3" :class="{'list-active':query.status===3}">待收货</a></dd>
                        <dd><a href="javascript:void(0)" @click="query.status=4" :class="{'list-active':query.status===4}">待评价</a></dd>
                    </dl>
                    <dl>
                        <dt><i>·</i> 我的中心</dt>
                        <dd><a href="home-person-collect.html">我的收藏</a></dd>
                        <dd><a href="home-person-footmark.html">我的足迹</a></dd>
                    </dl>
                    <dl>
                        <dt><i>·</i> 物流消息</dt>
                    </dl>
                    <dl>
                        <dt><i>·</i> 设置</dt>
                        <dd><a href="home-setting-info.html">个人信息</a></dd>
                        <dd><a href="home-setting-address.html">地址管理</a></dd>
                        <dd><a href="home-setting-safe.html">安全管理</a></dd>
                    </dl>
                </div>
            </div>
            <!--右侧主内容-->
            <div class="yui3-u-5-6 order-pay">
                <div class="body">
                    <div class="table-title">
                        <table class="sui-table  order-table">
                            <tr>
                                <thead>
                                <th width="35%">宝贝</th>
                                <th width="5%">单价</th>
                                <th width="5%">数量</th>
                                <th width="8%">商品操作</th>
                                <th width="10%">实付款</th>
                                <th width="10%">交易状态</th>
                                <th width="10%">交易操作</th>
                                </thead>
                            </tr>
                        </table>
                    </div>
                    <div class="order-detail">
                        <div class="orders">
                            <div class="choose-order">
                                <div class='input-append'>
                                    <input style="font-weight:bold" type='text' v-model="query.key"
                                           placeholder="商品名称"/>
                                    <button   @click="loadOrder" type='button'>搜索</button>
                                </div>
                                <div class="sui-pagination pagination-large top-pages">
                                    <ul>
                                        <li :class="query.page === 1 ? 'disabled': ''" class="prev"
                                            @click="gotoPage(query.page - 1)"><a href="javascript:void(0)">上一页</a></li>

                                        <li :class="query.page === pageInfo.totalPage ? 'disabled': ''"
                                            @click="gotoPage(query.page + 1)" class="next"><a href="javascript:void(0)">下一页</a>
                                        </li>

                                    </ul>
                                </div>
                            </div>

                            <!--order1-->
                            <div v-if="orders.length == 0">您还没有订单数据</div>
                            <div v-for="(o, i) in orders" :key="i">
                            <div class="choose-title">
                                <label data-toggle="checkbox" class="checkbox-pretty ">
                                    <input type="checkbox" checked="checked" />
                                    <span>{{formatDate(o.createTime)}}　订单编号：{{o.orderId}} <a>联系客服</a></span>
                                </label>
                                <a class="sui-btn btn-info share-btn">分享</a>
                            </div>
                            <table class="sui-table table-bordered order-datatable">
                                <tbody>
                                <tr v-for="(d,j) in o.orderDetails" :key="j">
                                    <td width="35%">
                                        <div class="typographic"><img width="70px" height="70px" :src="d.image"/>
                                            <a href="#" class="block-text">包邮 {{d.title}}</a>
                                            <span class="guige" v-for="(v,k) in JSON.parse(d.spec)" :key="k">{{k+':'+ v}}</span>
                                        </div>
                                    </td>
                                    <td width="5%" class="center">
                                        <ul class="unstyled">
                                            <li>¥{{formatPrice(d.price)}}</li>
                                        </ul>
                                    </td>
                                    <td width
                                                ="5%" class="center">{{d.num}}</td>
                                    <td width="8%" class="center" :rowspan="o.orderDetails.length" v-if="j === 0">
                                        <ul class="unstyled" v-if="o.status === 3">
                                            <li>已发货</li>
                                            <li><a>退货/退款</a></li>
                                        </ul>
                                    </td>
                                    <td width="10%" class="center" :rowspan="o.orderDetails.length" v-if="j === 0">
                                        <ul class="unstyled">
                                            <li>¥{{formatPrice(o.actualFee)}}</li>
                                            <li>（含运费：￥{{formatPrice(o.postFee)}}）</li>
                                        </ul>
                                    </td>
                                    <td width="10%" class="center" :rowspan="o.orderDetails.length" v-if="j === 0">
                                        <ul class="unstyled">
                                            <li v-if="o.status === 1">等待买家付款</li>
                                            <li v-if="o.status === 2">已付款</li>
                                            <li v-if="o.status === 3">已发货</li>
                                            <li v-if="o.status === 4">交易成功</li>
                                            <li v-if="o.status === 5">交易取消</li>
                                            <li v-if="o.status === 6">已评价</li>
                                            <li><a href="home-orderDetail.html" class="btn">订单详情 </a></li>
                                        </ul>
                                    </td>
                                    <td width="10%" class="center" :rowspan="o.orderDetails.length" v-if="j === 0">
                                        <ul class="unstyled">
                                            <li v-if="o.status === 1"><a :href="'/pay.html?id=' + o.orderId"
                                                                         class="sui-btn btn-info">立即付款</a>
                                            </li>
                                            <li v-if="o.status === 1">{{calCancelTime(o.createTime)}}后自动取消</li>
                                            <li v-if="o.status === 2" @click="sendMsg(o.orderId)"><a
                                                    href="javascript:void(0)" class="sui-btn btn-info">提醒发货</a>
                                            </li>
                                            <li v-if="o.status === 3"><a @click="confirm(o.orderId)" href="#"
                                                                         class="sui-btn btn-info">确认收货</a>
                                            </li>
                                            <li v-if="o.status === 6"><a href="javascript:void(0)" @click="updata(o.orderId, d.skuId)"
                                                                         class="sui-btn btn-info">修改评价</a>
                                            </li>

                                            <li v-if="o.status === 3">{{calConfirmTime(o.consignTime)}}后自动确认</li>
                                            <li v-if="o.status === 4"><a href="javascript:void(0)"
                                                                         @click="uComment(o.orderId)" class="sui-btn btn-info">
                                                立即评价</a>
                                            </li>
                                            <li v-if="o.status === 2"><a @click="cancelOrder(o.orderId)"
                                                                         href="javascript:void(0)">取消订单</a></li>
                                        </ul>
                                    </td>
                                </tr>




                                </tbody>
                            </table>
                            </div>
                        </div>
                        <el-dialog title="请对商品进行评价" :visible.sync="visibleComment">
                            <el-form  v-for="(e,f) in comment" :key="f "  >
                                <el-form-item :label-width="formLabelWidth" >

                                    <img width="70px" height="70px" :src="e.image"/><span>
                                            {{e.title}}
                                        </span><span>{{e.price}}</span>
                                </el-form-item>
                                <el-form-item label="物流评价" :label-width="formLabelWidth">
                                    <el-rate
                                            v-model="e.logistics"
                                            show-text>
                                    </el-rate>
                                </el-form-item>
                                <el-form-item label="服务评价" :label-width="formLabelWidth">
                                    <el-rate
                                            v-model="e.service"
                                            show-text>
                                    </el-rate>
                                </el-form-item>
                                <el-form-item label="商品评价" :label-width="formLabelWidth">
                                    <el-rate
                                            v-model="e.describe"
                                            show-text>
                                    </el-rate>
                                </el-form-item>
                                <el-form-item label="图文评价" :label-width="formLabelWidth">
                                    <el-input
                                            type="textarea"
                                            autosize
                                            placeholder="请输入内容"
                                            v-model="e.describespec">
                                    </el-input>
                                </el-form-item>
                                    <el-form-item label="上传图片" :label-width="formLabelWidth">
                                     <el-upload

                                            action=""
                                            :style="avatarStyle"
                                            class="logo-uploader"
                                            :show-file-list="false"
                                            :http-request="handleUpload">

                                         <img v-if="showImg(f)" :src="e.images"
                                              class="avatar">

                                        <i v-else class="el-icon-plus avatar-uploader-icon"></i>
                                    </el-upload>

                                </el-form-item>
                            </el-form>
                            <div slot="footer" class="dialog-footer">
                                <el-button @click="commentClose()">取 消</el-button>
                                <el-button type="primary" @click="commentComit()">确 定</el-button>
                            </div>
                        </el-dialog>
                        <el-dialog title="请对商品进行评价" :visible.sync="editVisibleComment">
                            <el-form  v-for="(e,f) in editComment" :key="f "  >
                                <el-form-item :label-width="formLabelWidth" >

                                    <img width="70px" height="70px" :src="e.image"/><span>
                                            {{e.title}}
                                        </span><span>{{e.price}}</span>
                                </el-form-item>
                                <el-form-item label="物流评价" :label-width="formLabelWidth">
                                    <el-rate
                                            v-model="e.logistics"
                                            show-text>
                                    </el-rate>
                                </el-form-item>
                                <el-form-item label="服务评价" :label-width="formLabelWidth">
                                    <el-rate
                                            v-model="e.service"
                                            show-text>
                                    </el-rate>
                                </el-form-item>
                                <el-form-item label="商品评价" :label-width="formLabelWidth">
                                    <el-rate
                                            v-model="e.describe"
                                            show-text>
                                    </el-rate>
                                </el-form-item>
                                <el-form-item label="图文评价" :label-width="formLabelWidth">
                                    <el-input
                                            type="textarea"
                                            autosize
                                            placeholder="请输入内容"
                                            v-model="e.describespec">
                                    </el-input>
                                </el-form-item>
                                <el-form-item label="上传图片" :label-width="formLabelWidth">
                                    <el-upload

                                            action=""
                                            :style="avatarStyle"
                                            class="logo-uploader"
                                            :show-file-list="false"


                                            :http-request="(params)=&gt;editHandleUpload(params,f)">

                                        <img v-if="showImg(f)" :src="e.images"
                                             class="avatar">

                                        <i v-else class="el-icon-plus avatar-uploader-icon"></i>
                                    </el-upload>

                                </el-form-item>
                            </el-form>
                            <div slot="footer" class="dialog-footer">
                                <el-button @click="commentClose()">取 消</el-button>
                                <el-button type="primary" @click=" editommentComit()">确 定</el-button>
                            </div>
                        </el-dialog>
                        <div class="choose-order">
                            <div class="sui-pagination pagination-large top-pages">
                                <ul>

                                    <li v-if="query.page !== 1" class="prev" @click="gotoPage(query.page - 1)"><a
                                            href="javascript:void(0)">«上一页</a></li>

                                    <template v-for="n in pageInfo.totalPage">
                                        <li  :class="query.page===n?'active':''" @click="gotoPage(n)"><a
                                                href="javascript:void(0)">{{n}}</a></li>
                                    </template>

                                    <li v-if="query.page !== pageInfo.totalPage" @click="gotoPage(query.page + 1)"
                                        class="next"><a href="javascript:void(0)">下一页»</a></li>
                                </ul>
                                <div><span>共{{pageInfo.totalPage}}页&nbsp;</span><span>
                                            到
                                            <input type="text" class="page-num"><button class="page-confirm"
                                                                                        onclick="alert(1)">确定</button>
                                            页</span></div>
                            </div>
                        </div>

                        <div class="clearfix"></div>
                    </div>

                    <div class="like-title">
                        <div class="mt">
                            <span class="fl"><strong>热卖单品</strong></span>
                        </div>
                    </div>
                    <div class="like-list">
                        <ul class="yui3-g">
                            <li class="yui3-u-1-4">
                                <div class="list-wrap">
                                    <div class="p-img">
                                        <img src="img/_/itemlike01.png"/>
                                    </div>
                                    <div class="attr">
                                        <em>DELL戴尔Ins 15MR-7528SS 15英寸 银色 笔记本</em>
                                    </div>
                                    <div class="price">
                                        <strong>
                                            <em>¥</em>
                                            <i>3699.00</i>
                                        </strong>
                                    </div>
                                    <div class="commit">
                                        <i class="command">已有6人评价</i>
                                    </div>
                                </div>
                            </li>
                            <li class="yui3-u-1-4">
                                <div class="list-wrap">
                                    <div class="p-img">
                                        <img src="img/_/itemlike02.png"/>
                                    </div>
                                    <div class="attr">
                                        <em>Apple苹果iPhone 6s/6s Plus 16G 64G 128G</em>
                                    </div>
                                    <div class="price">
                                        <strong>
                                            <em>¥</em>
                                            <i>4388.00</i>
                                        </strong>
                                    </div>
                                    <div class="commit">
                                        <i class="command">已有700人评价</i>
                                    </div>
                                </div>
                            </li>
                            <li class="yui3-u-1-4">
                                <div class="list-wrap">
                                    <div class="p-img">
                                        <img src="img/_/itemlike03.png"/>
                                    </div>
                                    <div class="attr">
                                        <em>DELL戴尔Ins 15MR-7528SS 15英寸 银色 笔记本</em>
                                    </div>
                                    <div class="price">
                                        <strong>
                                            <em>¥</em>
                                            <i>4088.00</i>
                                        </strong>
                                    </div>
                                    <div class="commit">
                                        <i class="command">已有700人评价</i>
                                    </div>
                                </div>
                            </li>
                            <li class="yui3-u-1-4">
                                <div class="list-wrap">
                                    <div class="p-img">
                                        <img src="img/_/itemlike04.png"/>
                                    </div>
                                    <div class="attr">
                                        <em>DELL戴尔Ins 15MR-7528SS 15英寸 银色 笔记本</em>
                                    </div>
                                    <div class="price">
                                        <strong>
                                            <em>¥</em>
                                            <i>4088.00</i>
                                        </strong>
                                    </div>
                                    <div class="commit">
                                        <i class="command">已有700人评价</i>
                                    </div>
                                </div>
                            </li>

                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="clearfix footer"></div>

    <foot></foot>

    <side-panel></side-panel>

</div>

<!--页面顶部，由js动态加载-->
<script src="./js/vue/vue.js"></script>
<script src="./js/axios.min.js"></script>
<script src="./js/common.js"></script>
<script src="./js/pages/shortcut.js"></script>
<script src="./js/pages/top.js"></script>
<script src="./js/pages/copyright.js"></script>
<script src="./js/pages/foot.js"></script>
<script src="./js/pages/side-panel.js"></script>
<script src="./js/plugins/jquery/jquery.cookie.js"></script>
<script>Vue.config.productionTip = false</script>

<script src="./js/elementUI/index.js"></script>
<script link rel="stylesheet" src="./js/elementUI/index.css"></script>

<script type="text/javascript">
    var vm = new Vue({
        el: "#account",
        data: {
            user: {},
            orders:[],
            query:{
                status:0,
                page:1,
                rows:5,
                key:''
            },
            pageInfo: {
                totalPage: null,
                total: null
            },
            pageInput: '',
            visibleComment:false,
            comment:[],
            dialogTableVisible:true,
            imageUrl:null,

            formLabelWidth:'250px',
            autoUpload:true,
            myHeaders: {contentType: false},
            avatarStyle: {
                width: this.picWidth + 'px',
                height: this.picHeight + 'px',
                'line-height': this.picHeight + 'px'
            },
            resp:{},
            needSignature:true,
            num:-1,
            num1:-1,
            dialogImageUrl:'',
            editComment:[],
            editVisibleComment:false,
        },
        created() {
            // 有token，曾经登录过，查询用户信息
            ly.http.get("/user/info/me")
                .then(resp => {
                    this.user = resp.data;
                    // 查询订单信息
                    this.loadOrder();
                })
                .catch((err) => {
                    // 去登录
                    this.gotoLogin();
                    console.log(err)
                });
        },
        methods: {

            logout() {
                // 删除cookie中的token即可
                Cookies.remove("LY_TOKEN", {
                    path: "/",
                    domain: "leyou.com"
                });
                window.location = 'http://www.leyou.com'
            },
            gotoLogin() {
                window.location = "login.html?returnUrl=" + window.location;
            },
            loadOrder(){
                ly.http.get("/trade/order/list?" + ly.stringify(this.query))

                    .then(resp => {
                        this.orders = resp.data.items;
                        this.pageInfo.total = resp.data.total;
                        this.pageInfo.totalPage = resp.data.totalPage;
                    }).catch(() => {
                    this.orders = []
                    this.pageInfo = {
                        totalPage: null,
                        total: null
                    }
                })
            },
            formatDate:ly.formatDate,
            formatPrice: ly.formatPrice,

            calConfirmTime(consignTime) {
                var consignTimeObj = moment(consignTime)
                var confirmTimeObj = consignTimeObj.add(7, 'd')
                var dura = moment.duration(confirmTimeObj - moment(), 'ms');
                return `${dura.days()}天${dura.hours()}小时`
            },
            calCancelTime(createTime) {
                var createTimeObj = moment(createTime)
                var cancelTimeObj = createTimeObj.add(30, 'm')
                var dura = moment.duration(cancelTimeObj - moment(), 'ms');
                return `${dura.minutes()}分钟`
            },
            sendMsg(id){
                this.$message.success("已提醒商家发货")
            },
            cancelOrder(orderId){
                this.$confirm('是否取消订单?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {
                    var statu=5;
                    ly.http.get("/trade/order/updateStatus?orderId="+orderId+"&statu="+statu)
                        .then(resp => {
                            this.$message.success("订单取消成功")
                        }).catch(() => {
                        this.$message.success("订单取消失败")
                    })

                })
            },
            confirm(orderId){
                this.$confirm('是否确认收货?', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {
                    var statu=4;
                    ly.http.get("/trade/order/updateStatus?orderId="+orderId+"&statu="+statu)
                        .then(resp => {
                            this.$message.success("确认收货成功")
                        }).catch(() => {
                        this.$message.success("确认收货失败")
                    })

                })
            },
            uComment(orderId) {
                this.comment = {},
                    axios.get("/evaluate/evaluate/orderDetail?"+"orderId="+orderId).then(res=>{
                        this.comment=res.data;
                    });
                    this.visibleComment = true;

            },
            commentClose(){
                this.visibleComment=false;
                this.editVisibleComment=false;
                this.num=-1;
                this.comment=[];
                this.editComment=[];
                this.dialogImageUrl='';
            },
            commentComit() {

               axios.post("/evaluate/evaluate/add",this.comment).then(res=>{
                    this.$message.success("评价成功");
                   this.commentClose();
                   this.loadOrder();
               })

            },
            handleAvatarSuccess(f) {
                this.num1 =f;


            },

            async handleUpload(params) {

                const file = params.file;
                const fileType = file.type;
                const isImage = fileType.indexOf('image') !== -1;

                const isLt2M = file.size < 2 * 1024 * 1024;

                if (!isLt2M) {
                    this.$message.error('上传图片或视频大小不能超过 2MB!');
                    return;
                }

                if (!isImage) {
                    this.$message.error('请选择图片!');
                    return;
                }
                // 准备文件名称
                let filename = file.name;
                let uploadUrl = "auth/ali/oss/signature";
                // 准备上传表单
                const formData = new FormData();
                // 是否需要签名
                if (this.needSignature) {
                    // 判断之前签名是否有效，如果超时，则重新申请一个
                    if (this.resp.expire < new Date().getTime() || this.resp.expire == null) {

                        await axios.get("auth/ali/oss/signature").then(resp => {
                            this.resp = resp.data;
                            }
                        );
                    }

                    // 修改文件名为随机文件名
                    filename = this.resp.dir + "/" + filename;
                    // 修改上传文件路径
                    uploadUrl = this.resp.host;
                    // 准备请求参数
                    formData.append("key", filename);
                    formData.append("policy", this.resp.policy);
                    formData.append("OSSAccessKeyId", this.resp.accessId);
                    formData.append("success_action_status", '200');
                    formData.append("signature", this.resp.signature);}

                    formData.append("file", file);
                    const that = this;

                    axios.post(uploadUrl, formData, {headers: {'Content-Type': 'multipart/form-data', 'x': 'y'}})
                        .then(resp => {
                            console.log(resp);
                            if (resp.status < '300') {
                                // 获取文件路径
                                const fileUrl = resp.data || uploadUrl + "/" + filename;
                                // 判断是多文件还是单文件
                                if (!this.multiple) {
                                    this.num=this.num+1;
                                    // 单文件，直接获取地址即可；
                                    this.comment[this.num].images = fileUrl;
                                    this.dialogImageUrl = fileUrl;

                                    this.$emit("input", fileUrl)
                                } else {
                                    // 多文件，放到集合中
                                    const files = this.$refs.multiUpload.uploadFiles;
                                    files[files.length - 1].response = fileUrl;
                                    this.fileList = files;
                                    this.$emit("input", files.map(f => f.response))
                                }
                            } else {
                                that.$message.error('上传失败');
                            }
                        })
                        .catch(function (err) {
                            this.$message.error('上传失败');
                            console.log(err);
                        });

            },
            async editHandleUpload(params,f) {
                console.log(params);
                console.log(f);
                const file = params.file;
                const fileType = file.type;
                const isImage = fileType.indexOf('image') !== -1;

                const isLt2M = file.size < 2 * 1024 * 1024;

                if (!isLt2M) {
                    this.$message.error('上传图片或视频大小不能超过 2MB!');
                    return;
                }

                if (!isImage) {
                    this.$message.error('请选择图片!');
                    return;
                }
                // 准备文件名称
                let filename = file.name;
                let uploadUrl = "auth/ali/oss/signature";
                // 准备上传表单
                const formData = new FormData();
                // 是否需要签名
                if (this.needSignature) {
                    // 判断之前签名是否有效，如果超时，则重新申请一个
                    if (this.resp.expire < new Date().getTime() || this.resp.expire == null) {

                        await axios.get("auth/ali/oss/signature").then(resp => {
                                this.resp = resp.data;
                            }
                        );
                    }

                    // 修改文件名为随机文件名
                    filename = this.resp.dir + "/" + filename;
                    // 修改上传文件路径
                    uploadUrl = this.resp.host;
                    // 准备请求参数
                    formData.append("key", filename);
                    formData.append("policy", this.resp.policy);
                    formData.append("OSSAccessKeyId", this.resp.accessId);
                    formData.append("success_action_status", '200');
                    formData.append("signature", this.resp.signature);}

                formData.append("file", file);
                const that = this;

                axios.post(uploadUrl, formData, {headers: {'Content-Type': 'multipart/form-data', 'x': 'y'}})
                    .then(resp => {

                        if (resp.status < '300') {
                            // 获取文件路径
                            const fileUrl = resp.data || uploadUrl + "/" + filename;
                            // 判断是多文件还是单文件
                            if (!this.multiple) {
                                this.editComment[f].images = fileUrl;
                                this.dialogImageUrl = fileUrl;

                                this.$emit("input", fileUrl)
                            } else {
                                // 多文件，放到集合中
                                const files = this.$refs.multiUpload.uploadFiles;
                                files[files.length - 1].response = fileUrl;
                                this.fileList = files;
                                this.$emit("input", files.map(f => f.response))
                            }
                        } else {
                            that.$message.error('上传失败');
                        }
                    })
                    .catch(function (err) {
                        this.$message.error('上传失败');
                        console.log(err);
                    });

            },
            showImg(f){
                console.log(f);
                if(f<=this.num){
                    return true;
                }else {
                    return false;
                }
            },
            updata(orderId, skuId){
                this.num=100;
                axios.get("evaluate/evaluate/editComment?orderId="+orderId).then(res=>{
                    this.editComment=res.data;
                    this.editVisibleComment=true;
                })
    },
            editommentComit() {

                axios.post("/evaluate/evaluate/add",this.editComment).then(res=>{
                    this.$message.success("评价成功");
                    this.commentClose();
                    this.loadOrder();
                })

            }
        },
        watch: {
            'query.status': {
                handler() {
                    this.query.page = 1
                    this.loadOrder();
                }
            },
            'query.page': {
                handler() {
                    this.loadOrder()
                }
            }
        }
    })
</script>
<script type="text/javascript">
    $(function () {
        $("#service").hover(function () {
            $(".service").show();
        }, function () {
            $(".service").hide();
        });
        $("#shopcar").hover(function () {
            $("#shopcarlist").show();
        }, function () {
            $("#shopcarlist").hide();
        });

    })
</script>
</html>